<template>
    <div>
        <detail-modal v-model="infoModalShow" :fullscreen="fullscreen" :title="title" :width="width">
            <Form :model="formItem" :label-width="80">
                <FormItem label="来源平台：">
                    <label>{{formItem.PlatformName}}</label>
                </FormItem>
                <FormItem label="请求Id：">
                    <label>{{formItem.RequestId}}</label>
                </FormItem>
                <FormItem label="业务位置：">
                    <label>{{formItem.BusinessPosition}}</label>
                </FormItem>
                <FormItem label="日志内容：">
                    <Input v-model="formItem.Content" type="textarea" :autosize="{minRows: 2}"/>
                </FormItem>
                <FormItem label="堆栈信息：">
                    <Input v-model="formItem.TraceInfo" type="textarea" :autosize="{minRows: 2}"/>
                </FormItem>
                <FormItem label="生成时间：">
                    <label>{{format(formItem.CreationTime)}}</label>
                </FormItem>
            </Form>
        </detail-modal>
    </div>
</template>

<script>
    import {formatDate} from '@/libs/tools';
    import DetailModal from '_c/detail-modal';

    export default {
        name: 'LogDetails',
        components: {
            DetailModal
        },
        data() {
            return {
                infoModalShow: this.value
            };
        },
        props: {
            value: {
                type: Boolean,
                default: false
            },
            fullscreen: false,
            title: {
                type: String,
                default: '详情'
            },
            formItem: {},
            width: {
                type: [Number, String],
                default: 520
            }
        },
        methods: {
            handleConfirm() {
                this.infoModalShow = false;
                this.$emit('on-confirm');
            },
            format(date) {
                return formatDate(date, 'yyyy-MM-dd hh:mm:ss');
            }
        },
        watch: {
            infoModalShow(newVal) {
                this.$emit('input', newVal);
                if (!newVal) this.$emit('on-cancel');
            },
            value(val) {
                this.infoModalShow = val;
            }
        }
    };
</script>

<style scoped>

</style>
